﻿@model MobileWebsiteGenerator.Models.MainViewModel
@{
    char[] type = new char[] { ',' };
    var SwatchData = Model.MyTheme.Swatch.Split(type);
    var listtext = SwatchData[0];
    var listBG = SwatchData[1];
    var hoverBg = SwatchData[2];
    Layout = "~/Views/Shared/_Layout.mobile.cshtml";
}
<style type="text/css">

 #PageContainer
    {
       background-color: @Model.MyTheme.backgroundColor;
   background-image:url('@Url.Content("~/uploads/" + Model.MyTheme.backgroundImage)');
        border: 1px solid #fff;        
        margin: 0px;
        padding: 0px;
        margin-left:2px;

    
       position:relative;
    }
    #PageContainer span
    {
        line-height: 20px;
        letter-spacing: 1px;
        margin-top: 15px;
    }
    #header
    {
         background-color: @Model.MyTheme.Headercolor;
        height: 40px;
        vertical-align:top;  
        margin-top:-15px;
        
       


     
    
      
      
     
      
        color: white;
        background-image: url('@Url.Content("~/uploads/" + Model.MyTheme.HeaderImage)');
        text-align: center;
    }
    .footer
    {
        height: 40px;
        text-align: center;
           vertical-align:bottom;
        color: white;
        margin-top:7px;
    
      
        
        background-color: Black;
    }


    ul.metroui-list
    {
   
        list-style: none;
        padding-left: 20px;
         padding-right: 20px;
         
          margin:5;
    }
    
    ul.metroui-list li
    {
     
        padding: 5px;
        margin-top:2 px;
        color:@listtext;
        margin-bottom: 15px;
        background-color:@listBG;
        color: ;
        cursor: pointer;
        border:solid 1px #FFFFFF ;
    }
    
    ul.metroui-list li:hover
    {
        background-color:@hoverBg;
    }
    
    li.metroui-list-selected
    {
        background-color: #4e534b !important;
        color:red;
    }
</style>
<div id="PageContainer">
    <div style="top: 0px; width: auto; position: static;" id="header">
        <h4>@Model.MyTheme.HHeaderText</h4>
    </div>
    <div style="margin: 3px;">
        <ul id="menu" class="metroui-list">
            @foreach (var item in Model.ContentPages)
            {
                <a href="@Url.Action("AboutPages", "website", new { id = item.page_id })" style="text-decoration:none; color:White;">
                    <li>@item.HTitle</li></a>
            }
            @if (Model.Website.IsPictureGallery == true)
            {
                <li><a href="@Url.Action("pictureGallery", "website")" style="text-decoration:block;">
                    גלריית תמונות</a></li>
            }
        </ul>
    </div>
    <div class="footer">
        <h4>
            @Model.MyTheme.HFootertext</h4>
    </div>
</div>
